
<template>
  <n-config-provider :locale="zhCN" :date-locale="dateZhCN">
    <n-dialog-provider>
      <n-message-provider>
         <MessageContent></MessageContent>
          <DialogContent></DialogContent>
          <div v-if="store.state.IfTheFullScreen">
               <router-view > </router-view>
                <Dxheader v-if="store.state.isheader"></Dxheader>
          </div>
        <div class="kxpage" v-else>
        <div class="  main-app display-flex czbj dfsdfryte " >
          <Dxheader v-if="store.state.isheader"></Dxheader>
          <div class="flex-1 display-flex">
             <Dxsider v-if="store.state.OpenTheMenu"></Dxsider>
              <div class="flex-1 fddsgfdst">
                    <n-layout-content content-style="padding: 10px;">
                      <router-view v-slot="{ Component }">
                        <keep-alive :include="keepAlive">
                          <component :is="Component" />
                        </keep-alive>
                      </router-view>
                    </n-layout-content>
                  </div>
          </div>
        </div>
          </div>
      </n-message-provider>
    </n-dialog-provider>
  </n-config-provider>
</template>

 <script lang='ts' setup>
import {
  NMessageProvider,
  NDialogProvider,
  NConfigProvider,
  zhCN,
  dateZhCN,
} from "naive-ui";
import MessageContent from "./components/MessageContent.vue";
import DialogContent from "./components/DialogContent.vue";
import { ref } from "vue";
import store from "./store";
import Dxsider from "./layout/Dxsider.vue";
import Dxheader from "./layout/Kxheader.vue";

const windHeight = ref(store.state.windHeight);
const keepAlive = store.state.keepAlive;
</script>
<style>
  @import "./assets/css/kx.css"
</style>
<style scoped>
.main-app {
  height: 100vh;
}
.n-space-main {
  height: 100%;
}

.n-layout-sider {
  background: #181818;
}
.n-layout {
  background: transparent;
}
.fddsgfdst {
  overflow: auto;
}
.bgred{
  background: red;
}
</style>